/* ==========================================================================

   Global

   ========================================================================== */

    

    html {

        font-size: 62.5%;

    }

    

    a {

        color: #333;

    }

    

    a:hover {

        color: #0043b7;

    }

    

    body {

        color: #333;

        font: 12px/1.7 microsoft yahei, Arial, Helvetica, sans-serif;

        

    }

    

    .wrapper {

        max-width: 1200px;

        /*min-width: 980px; */

        _width: 1200px;

        padding: 0 10px;

        margin-left: auto;

        margin-right: auto;

    }

    

    .wrapper:after,

    .row:after {

        content: "";

        display: table;

        clear: both;

    }

    /* arrow */

    

    .arrow {

        position: absolute;

        top: 50%;

        margin-top: -4px;

    }

    

    .arrow * {

        position: absolute;

        top: 0;

        left: 0;

        width: 0;

        height: 0;

        border: 0 dashed transparent;

        overflow: hidden;

    }

    /* arrow-right */

    

    .arr-r * {

        border-left-style: solid;

        border-width: 4px 0 4px 4px;

    }

    

    .arr-r em {

        left: 1px;

    }

    

    .arr-r span {

        border-left-color: #3675bb;

    }

    

    .tri {

        position: absolute;

        width: 0;

        height: 0;

        border: 0 dashed transparent;

        overflow: hidden;

    }

    /* ==================================

   menu

   ================================== */

    

    .menu {

        position: relative;

    }

    /* menu-hd */

    

    .menu-hd {

        position: relative;

        z-index: 1002;

        overflow: hidden;

        height: 30px;

        line-height: 30px;

        padding: 0 20px 0 6px;

    }

    /* menu-bd */

    

    .menu-bd {

        display: none;

        position: absolute;

        z-index: 1001;

        margin-top: -1px;

    }

    

    .menu-bd-panel {

        padding: 5px 0;

        border: 1px solid #eee;

        background: #fff;

        min-width: 96px;

    }

    

    .menu-bd-panel a {

        display: block;

        padding: 0 5px;

        line-height: 28px;

        white-space: nowrap;

        color: #6C6C6C

    }

    /* menu arrow */

    

    .menu-hd .fa-caret-down {

        -webkit-transition: .3s ease-in;

        -moz-transition: .3s ease-in;

        -o-transition: .3s ease-in;

        transition: .3s ease-in;

        position: absolute;

        height: 30px;

        line-height: 30px;

        top: 0;

        right: 6px;

    }

    /* menu hover */

    

    .menu-hover .menu-hd {

        z-index: 10002;

    }

    

    .menu-hover .menu-bd {

        z-index: 10001;

    }

    

    .menu-hover .menu-hd {

        padding: 0 19px 1px 5px;

        border-width: 0 1px;

        border-style: solid;

        border-color: #eee;

        background: #fff;

    }

    

    .menu-hover .menu-hd .fa-caret-down {

        -webkit-transform: rotate(180deg);

        -moz-transform: rotate(180deg);

        -o-transform: rotate(180deg);

        transform: rotate(180deg);

    }

    

    .menu-hover .menu-bd-panel a:hover { background: #eee;  }





    /* search */



    /* ==========================================================================

   Header

   ========================================================================== */



    header {}

    

    header .wrapper { min-height: 80px; position: relative; z-index: 99;}    

    .logo { position: absolute; left:60px;width:20%;height:100px; overflow: hidden;line-height:100px; }  

    .logo img{max-width: 100%;}  

@media only screen and (max-width: 880px){

    .logo {left:10px;}  

}    

@media only screen and (max-width:767px) {

   .logo{display: none;}

}



.topbar .tel{right:200px;position: absolute;top: 15px; font-size: 14px;}

.topbar .tel i{color: #f00;}

.topbar .lang{right:50px;position: absolute;top: 17px;height: 14px; line-height: 14px;z-index: 999;}

.topbar .lang a{margin-left: 10px;font-size: 14px;}

@media only screen and (max-width:767px) {

  .topbar .lang a.cn,.topbar .tel{display:none;}

}



    /* ==========================================================================

   Nav

   ========================================================================== */

    /* primary */

    

    .globalnav {

        position: absolute;

        z-index: 999;

        right: 0;

        top: 16px;

    }

    

    .globalnav li {

        float: left;

    }

    

    .globalnav li a {

        display: block;

        color: #444;

        padding: 0 20px;

        font-size: 14px;

        line-height: 42px;

        font-family: microsoft yahei;

    }

    

    .globalnav .nav-sep {

        width: 2px;

        height: 42px;

        background: url(../images/nav-sep.gif) no-repeat 0;

    }

    

    .globalnav .active a,

    .globalnav li .active1 {

        color: #3476a5;

    }

    

    .dropdown {

        position: absolute;

        z-index: 999;

        background: #fff;

        background: rgba(255, 255, 255, .9);

        display: none;

        padding: 15px 20px;

        border-bottom: 3px solid #3476a5;

        margin-left: -65px;

        top: 100%;

        min-width: 150px;

    }

    

    @media (min-width:768px) {

        .active1 + .dropdown {

            top: 56px;

        }

    }

    

    .dropdown:after {

        content: "";

        position: absolute;

        width: 0;

        height: 0;

        border: 0 dashed transparent;

        overflow: hidden;

        border-top-style: solid;

        border-width: 5px 5px 0;

        border-top-color: #333;

        left: 50%;

        margin-left: -5px;

        top: -5px;

    }

    .dropdown a {

        /*    white-space: nowrap;*/

        line-height: 30px;

        font-size: 14px; 

        float: left;

        padding: 0;

        color: #000;

        background: none;

        border-bottom: 0 none;

        width: 95%;

        display: block;

        text-align: center;

    }

    

    @media (max-width:767px) {

        .dropdown a {

            /*    white-space: nowrap;*/

            font-size: 16px;

            width: 100%;

            text-align: left;

        }

        .dropdown { min-width: calc(100% - 40px);}

    }

    

    .dropdown a .fa {

        font-size: 12px;

        line-height: 30px;

        color: #ccc;

        padding-right: 5px;

    }

    

    .dropdown a:hover,

    .dropdown a:hover .fa {

        color: #3476a5;

    }

    

    

   

    /* ==========================================================================

   Content

   ========================================================================== */



.hidden {display: none;}



/* ==========================================================================

   home_products

   ========================================================================== */

.home_products{padding:80px 0;background:#fff url(../images/homepic02.png) top center no-repeat;  }

.hometit{text-align: center;font:300 32px/36px microsoft yahei;color: #666879;}

.hometit .txten{color: #e67c00;text-transform:Uppercase;}

.home_products .hprocon{margin-top: 40px;}

.home_products .hprocon .left{background-color: rgba(255,255,255,0.6);float: left; width:60%; padding:40px 0 20px 0; height: 260px; overflow: hidden;border:1px solid #e5e5e5;}

.home_products .hprocon .left .modetit{height: 45px;}

.home_products .hprocon .left .modetit h3{float: left; width: 150px;height: 45px; text-align: center; background: #e67c00;color: #fff;font:300 18px/45px microsoft yahei;}

.home_products .hprocon .left .modetit a{float: right;margin-right: 40px;color: #555;font-size: 14px;text-decoration: underline;}

.home_products .hprocon .left .warp{padding:40px 20px 20px 40px;}

.home_products .hprocon .left .warp li{width:33.3%; float: left; font: 300 14px/42px microsoft yahei;margin-bottom: 10px;}

.sbox{ height: 42px; border:1px solid #e3e5e6;margin-right: 20px;position: relative; overflow: hidden; text-indent: 15px;}

.sbox a{display: inline-block;z-index: 99; width: 100%; height: 100%;position: absolute; left: 0;top: 0;color: #555;}

.sbox_left .line{ z-index:9;

   position: absolute;

   display: inline-block;

   width: 100%;

   height: 42px;

   left: -100%;

   bottom: 0;

   background: #e67c00;

   -webkit-transition: all 0.3s ease; transition: all 0.3s ease;

}

.sbox_left:hover .line{left: 0;}

.sbox:hover a{color: #fff;}



.home_products .hprocon .right{ background-color: rgba(255,255,255,0.6);float: right; width: calc(40% - 50px); padding:40px 0 20px 0; height: 260px; overflow: hidden;border:1px solid #e5e5e5;}

.home_products .hprocon .right .modetit{height: 45px;}

.home_products .hprocon .right .modetit h3{float: left; width: 150px;height: 45px; text-align: center; background: #3476a5;color: #fff;font:300 18px/45px microsoft yahei;}

.home_products .hprocon .right .warp{padding:40px;}

.home_products .hprocon .right .ui-input{width: calc(100% - 24px); line-height:18px;padding:10px;margin-bottom:20px;}

.home_products .hprocon .right .ui-btn{cursor: pointer;padding:8px 0;width:100px;font-size:14px; font-family:microsoft yahei; text-align: center;

    border:0 none;background: #e0e6ea; color: #555;

    -webkit-transition: all 0.5s;

   -moz-transition: all 0.5s;

   -o-transition: all 0.5s;

   transition: all 0.5s;

}

.home_products .hprocon .right .ui-btn:hover{background:#3476a5;color:#fff;}

@media only screen and (max-width: 767px) {

.home_products .hprocon .left{float: none; width:100%;height:auto;}

.home_products .hprocon .left .warp li{width:100%;}

.home_products .hprocon .right{float: none; width:100%;margin-top:20px;}

.sbox{margin-right: 0;}

}



/* ==========================================================================

   home_applications

   ========================================================================== */

.home_applications{padding:80px 0;background:#fff url(../images/homebg01.jpg) top center no-repeat;background-size: cover;}

.home_applications .hometit{color: #fff;}

.home_applications .hometit .txten{color: #fff;}

.sbox02{ height: 50px; background: #fff; font: 300 16px/50px microsoft yahei;  margin-right: 20px;position: relative; overflow: hidden; text-indent: 15px;

box-shadow:2px 2px rgba(0,0,0,.3);

}

.sbox02 a{display: inline-block;z-index: 99; width: 100%; height: 100%;position: absolute; left: 0;top: 0;color: #555;}

.sbox02 i{margin-right: 10px;color: #f00;}

.sbox02:hover a,.sbox02:hover i{color: #fff;}

.sbox02 .line{ z-index:9;

   position: absolute;

   display: inline-block;

   width: 100%;

   height: 50px;

   left: 0;

   bottom:-100%;

   background: #054cc0;

   -webkit-transition: all 0.3s ease; transition: all 0.3s ease;

}

.sbox02:hover .line{bottom: 0;}



.happlica li{width: 33.3%;float: left;margin-top: 20px;}

.happlica{margin: 60px 0;}

.home_applications .more{text-align: center;}

.home_applications .more a{font: 300 16px/50px microsoft yahei; background: #e67c00;display: inline-block;padding:0 60px;color: #fff;}



@media only screen and (max-width: 767px) {

    .happlica{margin:20px 0;}

.happlica li{width:100%;float: left;}

.sbox02{margin-right: 0;}

}



/* ==========================================================================

   home_online

   ========================================================================== */

.home_online{padding:80px 0;background:#fff url(../images/homebg02.jpg) top center no-repeat;background-size: cover;}

.home_online .tit{width:250px; float: left;font: 300 36px/48px microsoft yahei;color: #3476a5;}

.home_online .tit span{display: block;font-size: 18px;text-transform:Uppercase;}

.home_online .tit i{font-size: 72px;}

.home_online .right{width: calc(100% - 280px);float: right;}

.home_online .right .mode{width: 48%; float: left;overflow: hidden;}

.home_online .right .mode01{margin-right: 2%;}

.home_online .right .ui-input{width: calc(100% - 24px); line-height:18px;padding:10px;margin-bottom:20px;}

.home_online .right a{height:50px;width:100%;font: 300 16px/50px microsoft yahei; text-align: center; display: inline-block;

    border:0 none;background: #3476a5; color: #fff;}

.home_online .right a span{font-size: 12px;}

.home_online .right a:hover{background:#135685;color:#fff;}

.home_online .right .mode02{padding-right: 20px;}

.home_online .right input::-webkit-input-placeholder {color: #999;font-size: 16px; font-family: microsoft yahei; }

.home_online .right select::-webkit-input-placeholder {color: #999;font-size: 16px;font-family: microsoft yahei; }

.home_online .right textarea::-webkit-input-placeholder {color: #999;font-size: 16px;font-family: microsoft yahei; }

@media only screen and (max-width:767px) {

.home_online .tit{width:100%; float: none;font: 300 36px/48px microsoft yahei;color: #3476a5;text-align: center;margin-bottom: 20px;}

.home_online .tit span{display: inline-block;font-size: 18px;text-transform:Uppercase;}

.home_online .tit i{font-size:24px;}

.home_online .right{width:100%;float: none;}

.home_online .right .mode{width:100%; float: none;}

.home_online .right .mode01{margin-right:0;}

.home_online .right .mode02{padding-right:0;}

}

/* ==========================================================================

   home_news

   ========================================================================== */

.home_news{padding:80px 0;background:#fff;}

.home_news .left{float: left; width:60%;overflow: hidden;}

.home_news .left .tit{font: 300 28px/30px microsoft yahei;color: #666879;margin-bottom:40px;}

.home_news .left .tit a{font-size: 14px; line-height: 24px; float: right;color: #b6b7bf; text-decoration: underline;}

.hnewslist li{width:100%;overflow: hidden; margin-bottom:30px;}

.hnewslist li .mdate{display: none;}

.hnewslist li .date{width:95px; height:95px;text-align: center; float: left;font: 300 16px/30px microsoft yahei;color: #999;background: #ebeef2;}

.hnewslist li .date h2{font: 600 24px/30px microsoft yahei;margin-top:20px;} 

.hnewslist li .txtarea{width: calc(100% - 120px); float: right;}

.hnewslist li .txtarea h3{font: 300 15px/24px microsoft yahei;width:100%;height: 30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.hnewslist li .txtarea h3 a{ color: #555;}

.hnewslist li .txtarea .desc{font: 300 12px/20px microsoft yahei;height:60px;overflow: hidden;color: #999;margin: 0 0 0 10px;}

.hnewslist li:hover .date{background: #e67c00;color: #fff;}



.home_news .right{float: right; width: calc(40% - 50px);overflow: hidden;}

.home_news .right .map img{max-width: 100%;}

.home_news .right .tit{font: 300 28px/30px microsoft yahei;color: #666879;margin-bottom:40px;}

.home_news .right ul{margin-top: 30px;}

.home_news .right li{font: 300 15px/36px microsoft yahei;color: #555;}

.home_news .right li .fa{color: #e67c00;margin-right: 10px;}

@media only screen and (max-width:767px) {

.home_online,.home_news,.home_products{padding:40px 0;}

.hnewslist li .txtarea{width:100%; float: left;padding-left:0;}

.hnewslist li .mdate{display: block;padding-left: 10px;font: 300 14px/30px microsoft yahei;}

.hnewslist li .date{display: none;}

.home_news .left{float: none; width:100%;}

.home_news .right{float: none; width:100%;}

}



/* ==========================================================================

   Footer

   ========================================================================== */

footer { color: #fff; font-size: 12px; background: #3476a5; font-family: microsoft yahei; padding:60px 0;}

footer a { color: #fff; }

footer a:hover { text-decoration: underline; }

.footer-nav { text-align: justify; }

.footer-nav:after { content: ""; width: 100%; display: inline-block; font-size: 0; line-height: 0; }

.fn-col { display: inline-block; *display:inline;

zoom: 1; vertical-align: top; *padding-right: 100px;}

.fn-col h3 {  margin-bottom: 10px; font: 300 16px/24px microsoft yahei;}

.fn-col h3 a { color:#fff;}

.fn-col h3 a:hover {text-decoration: underline; }

.fn-col ul {}

.fn-col li { line-height: 24px; font-size: 13px; }

.fn-col li a { color: #fff;  }

.fn-col li a:hover {text-decoration: underline;}



.fn-colpro{width: 330px;}

.fn-colpro li{width: 50%;float: left;}

.fn-colwx{width:300px;text-align: right; border-left: 1px solid #fff;padding-left: 20px;}

.wxmod{margin-bottom: 10px;}

.wxmod .txt{width: 200px; float: left;}

.wxmod .imgbox{width:80px;height:80px; float: right;}

.wxmod .imgbox img{width:80px;height:80px;}

.fn-colwx .ui-select{width: 120px;padding:5px 10px;margin-top: 10px;}





.fixed-b { position: fixed; width: 100%; background: #333; bottom: 0; left: 0; display: none;z-index: 9999; }

.fixed-b li { width: 25%; text-align: center; color: #fff; float: left; }

.fixed-b li a { display: block; border-right: 1px solid #454545; color: #fff; padding: 10px 0; }

.fixed-b li .fa{font-size: 24px; line-height: 30px;}

.fixed-b li:last-of-type a { border-right: 0 none; }

.fixed-b li a .txt { display: block; margin-top: 5px; }



@media only screen and (max-width: 767px) {

    footer{padding-bottom: 60px;padding-top: 30px;}

.fixed-b { display: block; }

.footer-nav { text-align: left;}

.fn-col ul {display:none;}

.fn-colpro{width:auto;}

.fn-colwx{width:100%;text-align: left;display: block;border-left: 0;padding-left: 0;}

.wxmod .imgbox{display: none;}

.wxmod .txt{width: 100%; float: none;}

}



.toggle-btn { display: none;}





@media only screen and (max-width: 767px) {

    .toggle-btn {

        display: block;

        position: absolute;

        right: 20px;

        top: 10px;

        transition: all 0.5s;

    }    

    .inner-cont > p img {

        width: 100%;

        height: auto;

        padding-bottom: 20px;

    }    

.gn-item:hover .toggle-btn {

        -webkit-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

        transform: rotate(45deg);

    }

}